<template>
  <div>
    <el-form :ref="'form' + item.itemName">
      <el-form-item :label="item.itemName == 1?'':item.itemName">
        <el-select v-model="item.indicatorsActVal" :disabled="isFinish" :placeholder="'处方'" @change="getData">
          <el-option
            v-for="item in options"
            :key="item.key"
            :label="item.key"
            :value="item.val">
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <div v-if="hackReset && item.children && item.children.length > 0">
      <el-row>
        <ItemPrescript :list="item.children" :isFinish="isFinish"></ItemPrescript>
      </el-row>
    </div>
  </div>
</template>

<script>

  import {processList, getClinicTreat} from "@/api/treatProcess"

  import {getTree} from "@/utils/info-item-tree";

  import ItemPrescript from "./ItemPrescript";

  export default {
    name: "Prescription",
    components: {
      ItemPrescript
    },
    props: {
      //item 父类信息
      item: Object,
      isFinish:{
        type:Boolean,
        default:false
      },
      clinicNo: {
        type: String,
        default: ""
      },
      labelWith: {
        type: String,
        default: ""
      }
    },
    data() {
      return {
        hackReset: true,
        options: [],
        dataList: [],
        children: []
      }
    },
    created() {
      console.log(this.item)
      window.a = this
      this.getProcess()
      if (this.item.indicatorsActVal !== "null") {
        this.getData()
      }
    },
    methods: {
      hideItem(data) {
        if (data.children) {
          let children = [];
          let _that = this;
          data.children.forEach(function (item) {
            if (item.children) {
              //递归调用
              let child = _that.hideItem(item);
              if (child.children.length > 0) {
                children.push(child);
              }
            }else if (item.indicatorsActVal) {
              children.push(item);
            }
          });
          data.children = children;
        }
        return data;
      },
      getProcess() {
        processList({"seq": 4, "pageSize": 50}).then(response => {
          if (response.code === 200) {
            this.options = response.page.list.map(function (item) {
              return {
                "val": item.projectId + "",
                "key": item.projectName
              }
            })
          }
        });
      },
      getData() {
        if (this.item.indicatorsActVal === "null"
          || this.item.indicatorsActVal === ""
          || this.item.indicatorsActVal === null) {
          // 销毁子标签
          this.hackReset = false;
          // 重新创建子标签
          this.$nextTick(() => {
            this.hackReset = true;
          });
          return
        }
        getClinicTreat({"projectId": this.item.indicatorsActVal, "seq": "4","clinicNo":this.clinicNo}).then(response => {
          // 销毁子标签
          this.hackReset = false;
          // 重新创建子标签
          this.$nextTick(() => {
            this.hackReset = true;
          });

          this.children = [];
          if (response.code === 200) {
            this.dataList = response.page.list.filter(function (item) {
              return item.available
            })
          }
          this.dataList = getTree(this.dataList)
          if (this.dataList.length > 0) {
            this.children = this.dataList[0].children;
            this.item.children = this.children
            if (this.isFinish) {
              this.item = this.hideItem(this.item);
            }
            console.log(this.children)
          }
        });
      },
    }
  }
</script>

<style scoped>

</style>
